<template>
    <a-card hoverable style="width: 300px" v-for="d in data" :key="d.id" @click="handleCardClick(d)">
        <template #cover>
            <img alt="example" src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png" />
        </template>
        <!-- <template #actions>
            <setting-outlined key="setting" />
            <edit-outlined key="edit" />
            <ellipsis-outlined key="ellipsis" />
        </template> -->
        <a-card-meta :title="d.clientName" :description="d.additionalInformation">
            <template #avatar>
                <a-avatar src="https://joeschmoe.io/api/v1/random" />
            </template>
        </a-card-meta>
    </a-card>
</template>
<script lang="ts" setup>
    // import { SettingOutlined, EditOutlined, EllipsisOutlined } from '@ant-design/icons-vue';
    import { jump } from '@/api/client/client';
    const data = [
        {
            id: '123',
            clientId: 'yfwy-test',
            clientName: '测试应用',
            redirectUri: encodeURIComponent('https://scn.jingxun.xyz/iot/business/login?name=jingxun&oauth=yf'),
            additionalInformation: '测试应用',
        },
    ];
    const handleCardClick = client => {
        jump(client.clientId, client.redirectUri);
    };
</script>
